<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>新增班级信息</title>
    <style type="text/css">
        body {
            margin: 0px;
            text-align: center;
        }

        #reg {
            width: 370px;
            border: 1px solid blue;
            line-height: 40px;
            margin: 0 auto;
            padding-left: 100px;
            padding-top: 15px;
            padding-bottom: 15px;
            text-align: left;
            font-size: 14px;
        }

        .error {
            color: red;
        }
    </style>
</head>
<body>
    <?php
    include 'HeaderNav.html'; //包含页头与导航页
    ?>
    <h1>班级注册</h1>
    <form action="classbnt.php" method="post" enctype="multipart/form-data">
        <div id="reg">
            <div>
                班级号:<input type="text" name="stuNo" /><span class="error">*</span></div>
            <div>
                班级:<input type="text" name="stuName" /><span class="error">*</span></div>
                <div style="margin-left:85px;">
                <input type="submit" name="btnsubmit" value="新增" />
            </div>
    </form>
    <script type="text/javascript">
        var elform = document.getElementsByTagName("form")[8]; //获取表单
        elform.onsubmit = function() {
            //表单提交，调用checkData()雨数验证数据，如果验证出错，中止表单提交 
            return checkData(); //验证各项用户输入的数据 
        }

        function checkData() {
            var valid = true; //验证是否通过的标识
            //学号必填
            var elStuNo = document.getElementsByName("stuNo")[0]; //获取班级文本框 
            if (elstuNo.value == "") {
                elstuNo.nextsibling.innerHTML = "*班级号必填!"; //班级文本框右侧的文字标签显示提示信息 
                valid = false; //验证错误
            } else {
                elstuNo.nextsibling.innerHTML = "*"; //清除错误提示信息
            }
            //姓名必填
            var elstuName = document.getElementsByName("stuName")[0]; //获取姓名文本框 
            if (elStuName.value == "") {
                elstuName.nextSibling.innerHTML = "*班级必填!";
                valid = false;
            } else {
                elstuName.nextsibling.innerHTML = "*";
            }
        } 
    </script>
    <?php
    include 'Footer.html'; //包含页脚页 
    ?>
</body>

</html>